<template>
    <div class="box">
        <div id="Player"></div>
        <el-row class="mt-3">
            <el-col :span="24" class="button-container">
                <el-button @click="closeHandle">关闭</el-button>
            </el-col>
        </el-row>
    </div>
</template>
  <script>
   
  export default {
    props: {
        playUrl: {
            type: String,
            required: true,
        },
    },
    data() {
      return {
        player: '',
      }
    },
    mounted() {
      // 实例化播放器
      this.player = new WasmPlayer(null, 'Player',()=>{},{cbUserPtr:this, decodeType:"auto", openAudio:1, BigPlay:false, Height:true,Width:true})
      // 调用播放
      setTimeout(() => {
        this.player.stop()
        this.player.play(this.playUrl, 1)
      }, 1000);
      
    },
    methods: {
        closeHandle() {
            this.player.stop();
            this.$emit('close'); // 触发父组件的 close 事件
        },
      //播放事件回调
      callbackfun(e) {
        console.log('callbackfun');
      }
    }  
  }
  </script>
  <style>
    .box {
      width:100%;
      height:100%;
    }
    .button-container {
        text-align: right; /* 将按钮对齐到右侧 */
    }
  </style>